
<table style="width: 100%">
    <tr>
        <td style="width: 50%">
            <div class="jqx_group">
                <div><h3 class="pl0 pr0 pt0 pb0 ml0 mr0 mt0 mb0">Information</h3></div>
                <div>
                    <input type="hidden" id="txt-id" value="{{$configs["accountobj"]["id"]}}"/>
                    <table style="width: 100%">
                        <tr>
                            <td style="width: 100px">Name</td>
                            <td>
                                <input type="text" id="txt-name" class="text-input " style="width: 150px" 
                                       value="{{$configs["accountobj"]["name"]}}"/>
                            </td>
                        </tr>
                        <tr>
                            <td style="width: 100px">User Name</td>
                            <td>
                                <input type="text" id="txt-uname" class="text-input" style="width: 150px"
                                       value="{{$configs["accountobj"]["username"]}}"/>
                            </td>
                        </tr>
                        <tr>
                            <td style="width: 100px">Pass Word</td>
                            <td>
                                <div>
                                    <input type="password" id="txt-pass" class="text-input" style="width: 150px"  
                                           value="" placeholder="Curent Password"/>
                                </div>
                            </td>
                        </tr>
                        <tr>
                            <td style="width: 100px">Group</td>
                            <td>
<!--                                <div>
                                    <select style="width: 100px">
                                        <option>1</option>
                                        <option>2</option>
                                    </select>
                                </div>-->
                                <div style='float: left;' id='jqxCbx_group'></div>
                            </td>
                        </tr>
                        {{if isset($configs["accountobj"]["insert"])}}
                        <tr>
                            <td style="width: 100px">Insert</td>
                            <td>
                                {{$configs["accountobj"]["insert"]}}
                            </td>
                        </tr>
                        {{/if}}
                        {{if isset($configs["accountobj"]["update"])}}
                        <tr>
                            <td style="width: 100px">Update</td>
                            <td>
                                {{$configs["accountobj"]["update"]}}
                            </td>
                        </tr>
                        {{/if}}

                    </table>
                </div>
            </div>
        </td>
        <td style="vertical-align: top">
            <input type="hidden" id="id-authority-acc" value="{{$configs["accountobj"]["authority"]}}"/>
            <div class="jqx_group id-group-authority">
                <div class=""><h3 class="pl0 pr0 pt0 pb0 ml0 mr0 mt0 mb0">Authority</h3></div>
                <div>
                    {{if is_array($configs["auth_list"]) and count($configs["auth_list"])>0}}
                        {{foreach $configs["auth_list"] as $au}}
                        <div style="display: inline-block;float: left">
                            <div style="margin-top: 10px;" class='jqx_chb {{$au->id}}'><span class="value">{{$au->name}}</span></div>
                        </div>
                        {{/foreach}}
                    {{else}}
                        No data to display.
                    {{/if}}
                    <div class="clear"></div>
                    
                    <span id="id-grp-autho" class="{{if $configs["group_index"]==0}}hidden{{/if}}">
                        
                    </span>
                </div>
            </div>

        </td>
    </tr>
    <tr>
        <td colspan="2">
<!--            <div class="errormessage pl20 pt8 pb8 pr20"></div>-->
            <input type="button" value="Save" class="showWindowButton id-save-btn" />
            <input type="button" value="Cancel" class="showWindowButton id-cancel-btn" />
        </td>
    </tr>
</table>
<script type="text/javascript">
        
        var AccountEditFRM = (function () {
            function _addEvents(){
                $("#txt-name").focus()
                $('.jqx_chb').bind('checked', function (event) {
                    var value=$(this).find('span.value').html();
                    var auvals=$("#id-authority-acc").val();
                    auvals=auvals+";"+value+";";
                    $("#id-authority-acc").val(auvals);
                    
                });
                $('.jqx_chb').bind('unchecked', function (event) { 
                    var value=$(this).find('span.value').html();
                    var auvals=$("#id-authority-acc").val();
                    auvals=auvals.replace(";"+value+";","");
                    $("#id-authority-acc").val(auvals);
                }); 
                $(".id-save-btn").click(function(){
                    {{if isset($configs["accountobj"]["lock"])}}
                        $('#window-notice').jqxWindow('setContent', 
                        "This item have been lock.<br/>Please don't change this item.");
                        $('#window-notice').jqxWindow('open');
                    {{elseif isset($configs["accountobj"]["delete"])}}
                        $('#window-notice').jqxWindow('setContent', 
                        "This item have been deleted.<br/>Please restore item before edit.");
                        $('#window-notice').jqxWindow('open');
                    {{else}}
                        save_acc();
                    {{/if}}
                });
                $(".id-cancel-btn").click(function(){
                     $('#window').jqxWindow('close');
                });
            };
            //Adding event listeners
            function _createElements() {
                var theme=AccountEditFRM.config.theme;
                //cbx
                var source = {{json_encode($configs["group_list"])}};
                // Create a jqxComboBox
                $("#jqxCbx_group").jqxComboBox({ 
                    selectedIndex: {{$configs["group_index"]}}, source: source, 
                    width: '160px', height: '25px', theme: theme });
                
                $('#jqxCbx_group').bind('select', function (event) {
                    var args = event.args;
                    var item = $('#jqxCbx_group').jqxComboBox('getItem', args.index);
                    if (item != null) {
                        //$('#Events').jqxPanel('prepend', '<div style="margin-top: 5px;">Selected: ' + item.label + '</div>');
                        if(item.label=="None"){
                            $("#id-grp-autho").hide();
                        }else{
                            $("#id-grp-autho").show();
                            $("#id-grp-autho").load('{{base_url()}}admin-planners/account/Group_Authority/'+item.label);
                        }
                    }
                });
                //create group checkbox authority
                {{if is_array($configs["auth_list"]) and count($configs["auth_list"])>0}}
                {{foreach $configs["auth_list"] as $au}}
                    
                $('.jqx_chb.{{$au->id}}').jqxCheckBox({ 
                    checked: {{if strrpos($configs["accountobj"]["authority"], ";"|cat:$au->name|cat:";")===false}}false{{else}}true{{/if}},
                    height: 25,width: '65px', theme:theme });
                {{/foreach}}
                {{/if}}
                $(".jqx_group").jqxExpander({ showArrow: false, toggleMode: 'none', theme: theme });//jqxExpander({ width: '100%', theme: AccountFRM.config.theme, showArrow: false, toggleMode: 'none' });
                $('.showWindowButton').jqxButton({ theme: theme, height: '25px', width: '100px' });
                
            };
            //Creating the demo window
            return {
                config: {
                    dragArea: null,
                    theme: 'classic'
                },
                init: function () {
                    //Creating all jqxWindgets except the window
                    _createElements();
                    //Add events
                    _addEvents();
                    
                }
            };
        } ());
        $(document).ready(function () {
            AccountEditFRM.init();
            {{if isset($configs["accountobj"]["group"])}}$("#id-grp-autho").load('{{base_url()}}admin-planners/account/Group_Authority/{{$configs["accountobj"]["group"]}}');{{/if}}
        });
</script>